import React, { useEffect } from "react"
import { Select } from "antd"
import { useDispatch, useSelector } from "react-redux"
import { getChannel } from "../../store/action"
const { Option } = Select
function Channel({ value, onChange, width }) {
  // 从reducer中获取文章频道
  const { channels } = useSelector((state) => state.article)
  const dispatch = useDispatch()
  // 获取文章频道
  useEffect(() => {
    dispatch(getChannel())
  }, [dispatch])
  return (
    <div>
      <Select
        value={value}
        placeholder="请选择文章频道"
        style={{ width: width }}
        onChange={onChange}
      >
        {/* onChange={handleChange} */}
        {channels.map((item, index) => {
          return (
            <Option key={index} value={item.id}>
              {item.name}
            </Option>
          )
        })}
      </Select>
    </div>
  )
}

export default Channel
